<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <style type="text/css">
        body{
            background-image: url(img/1.jpg);
        }
        #boss{
            width:500px;
            
            /* background-color: red; */
            margin:150px auto;
            border:1px solid ;
            background-color: rgba(138, 146, 153, 0.1);
            border-radius: 20px;
            padding:20px;
        }
        .formtype{
            margin:50px auto;
            display:block;
            
        }
        .first{
            width:500px;
            height:50px;
            font-size: 27px;
            /* outline-style:none; */
            border:1px solid rgb(0, 0, 0,0.5);
            border-radius:10px;
            box-shadow: 3px 3px 10px rgba(0,0,0,0.5);
            text-align:center;
            background-image:url(img/2.png);
            background-repeat: no-repeat;
            background-size: 40px;
            background-position: 8px 7px;
        }
        .first:hover{
            border:1px solid rgb(0, 0, 0);
            
            box-shadow: 3px 3px 10px rgba(0,0,0,1);
        }
        .first:focus{
            border:1px solid #ffb941;
        }
        .second{
            width:500px;
            height:50px;
            font-size: 27px;
            /* outline-style:none; */
            border:1px solid rgb(0, 0, 0,0.5);
            border-radius:10px;
            box-shadow: 3px 3px 10px rgba(0,0,0,0.5);
            text-align:center;
            background-image:url(img/3.png);
            background-repeat: no-repeat;
            background-size: 40px;
            background-position: 8px 7px;
        }
        .second:hover{
            border:1px solid rgb(0, 0, 0);
            
            box-shadow: 3px 3px 10px rgba(0,0,0,1);
            
        }
        #third{
            width:400px;
            height:50px;
            border-radius:20px;
            background-color: rgb(255,255,255);
            font-size: 27px;
        }
    </style>
</head>
<body>
    <form action="blog.html" id="boss">
        
        <input type="text" name="username" placeholder="请输入你的账号" class="formtype fi first"  />
        <input type="password" name="password" placeholder="请输入你的密码" class="formtype fi second" >
        <button type="submit" class="formtype" id="third">登录</button>
    </form>
    
</body>
</html>